/**
 * Reference: swfupload.js, swfupload.queue.js and libs/common/popup.js
 * 
 * NOTE: MUST SPECIFY CANCEL BUTTON ID
 * 
 *                                           注释                   举例........................
 * ----------------------------------------------------------------------------------------------------
 * @param browse_id:                         上传按钮的ID            'spanButtonPlaceHolder'
 * @param upload_url                         上传php文件的路径       '.../upload.php'
 * @param callbackFunc                       上传以后执行的函数      'function() { ... }'
 * @param opts debug                         是否打开提醒模式         1或0
 *             file_size_limit               上传文件大小上限         '100 MB'
 *             file_queue_limit              每次上传数量上限         1
 *             file_types                    上传文件类型             '*.jpg;*.jpeg;*.png;*.gif'
 *             file_type_description         上传文件类型描述         'Image Files'
 *             post_params                   传送到php端的参数        { id: 1 }
 *             button_image_url              上传按钮图片的路径       '.../upload.png'
 *             cancelBtnId                   取消按钮的ID             'btnCancel'
 * @return
 */
function MyUpload(browse_id, upload_url, callbackFunc, opts) {
  var pos = MyUpload.findPos(document.getElementById(browse_id));
  var dir = (opts && opts.dir) ? opts.dir : './';
  var settings = {
    flash_url : (opts && opts.flash_url) ? opts.flash_url : dir + 'libs/swfupload/assets/swfupload.swf',
    flash9_url : (opts && opts.flash9_url) ? opts.flash9_url : dir + 'libs/swfupload/assets/swfupload_fp9.swf',
    upload_url : upload_url,
    post_params : (opts && opts.post_params) ? opts.post_params : null,
    file_size_limit : (opts && opts.file_size_limit) ? opts.file_size_limit : '100 MB',
    file_types : (opts && opts.file_types) ? opts.file_types : '*.jpg;*.jpeg;*.png;*.gif',
    file_types_description : (opts && opts.file_types_description) ? opts.file_types_description : 'Image Files',
    file_upload_limit : 0,
    file_queue_limit : (opts && opts.file_queue_limit) ? opts.file_queue_limit : 0,
    custom_settings : {
      dir : dir,
      progressTarget : 'fsUploadProgress',
      cancelButtonId : (opts && opts.cancelBtnId) ? opts.cancelBtnId : 'btnCancel',
      position : (opts && opts.pos) ? opts.pos : [ pos[0] + 150, pos[1] ],
      progressWidth : (opts && opts.progressWidth) ? opts.progressWidth : '400px',
      done : [],
      total : [],
      callbackFunc: callbackFunc,
      debug: (opts && opts.debug) ? opts.debug : 0,
      msgs: [],
      finalMsg: null
    },
    debug : false,

    // Button settings
    button_image_url : (opts && opts.button_image_url) ? opts.button_image_url : dir + 'libs/swfupload/assets/browse2.png',
    button_width : (opts && opts.button_width) ? opts.button_width : 94,
    button_height : (opts && opts.button_height) ? opts.button_height : 29,
    button_placeholder_id : browse_id,
//    button_text: '<span class="theFont">Hello</span>',
//    button_text_style: '.theFont { font-size: 16; }',
    button_text_left_padding : 0,
    button_text_top_padding : 0,

    // The event handler functions are defined in handlers.js
    swfupload_preload_handler : preLoad,
    swfupload_load_failed_handler : loadFailed,
    file_queued_handler : fileQueued,
    file_queue_error_handler : fileQueueError,
    file_dialog_complete_handler : fileDialogComplete,
    upload_start_handler : uploadStart,
    upload_progress_handler : uploadProgress,
    upload_error_handler : uploadError,
    upload_success_handler : uploadSuccess,
    upload_complete_handler : uploadComplete,
    queue_complete_handler : queueComplete // Queue plugin event
  };

  swfu = new SWFUpload(settings);
};

MyUpload.formatNumber = function(number) {
  var result = '';
  number += '';
  for (var i = number.length - 1, il = 0; i >= il; i--) {
    result = number.charAt(i) + result;
    if ((i - number.length + 1) != 0 && ((i - number.length) % 3) == 0 && i > il) {
      result = ',' + result;
    }
  }
  return result;
};

MyUpload.getShortName = function(str, len) {
  if (str.length < len) {
    return str;
  }
  var left = str.substr(0, len / 2);
  var right = str.substr(str.length - len / 2, str.length);
  return left + '...' + right;
};

MyUpload.removeChildElements = function(elem) {
  while (elem && elem.firstChild) {
    elem.removeChild(elem.firstChild);
  }
};

MyUpload.findPos = function(elem) {
  var curleft = 0, curtop = 0;
  if (elem.offsetParent) {
    curleft = elem.offsetLeft;
    curtop = elem.offsetTop;
    while ((elem = elem.offsetParent)) {
      curleft += elem.offsetLeft;
      curtop += elem.offsetTop;
    }
  }
  return [ curleft, curtop ];
};

MyUpload.xDocSize = function() {
  var b = document.body, e = document.documentElement;
  var esw = 0, eow = 0, bsw = 0, bow = 0, esh = 0, eoh = 0, bsh = 0, boh = 0;
  if (e) {
    esw = e.scrollWidth;
    eow = e.offsetWidth;
    esh = e.scrollHeight;
    eoh = e.offsetHeight;
  }
  if (b) {
    bsw = b.scrollWidth;
    bow = b.offsetWidth;
    bsh = b.scrollHeight;
    boh = b.offsetHeight;
  }
  return {
    w : Math.max(esw, eow, bsw, bow),
    h : Math.max(esh, eoh, bsh, boh)
  };
};

MyUpload.unique = function() {
  var unique = 'u' + parseInt(new Date().getTime() * Math.random());
  unique = unique.replace('.', '');
  unique.substring(0, 16);
  return unique;
};

function preLoad() {
  if (!this.support.loading) {
    alert("You need the Flash Player 9.028 or above to use SWFUpload.");
    return false;
  }
}
function loadFailed() {
  alert("Something went wrong while loading SWFUpload. If this were a real application we'd clean up and then give you an alternative");
}

function fileQueued(file) {
  try {
    this.customSettings.total[this.customSettings.total.length] = file;
  } catch (ex) {
    this.debug(ex);
  }
}

function fileQueueError(file, errorCode, message) {
  try {
    if (errorCode === SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED) {
      alert("You have attempted to queue too many files.\n" + (message === 0 ? "You have reached the upload limit." : "You may select " + (message > 1 ? "up to " + message + " files." : "one file.")));
      return;
    }
    switch (errorCode) {
    case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:
      alert(file.name + ": File is too big.");
      this.debug("Error Code: File too big, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:
      alert(file.name + ": Cannot upload Zero Byte files.");
      this.debug("Error Code: Zero byte file, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:
      alert(file.name + ": invalid File Type.");
      this.debug("Error Code: Invalid File Type, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    default:
      if (file !== null) {
        alert(file.name + ": Unhandled Error");
      }
      this.debug("Error Code: " + errorCode + ", File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    }
  } catch (ex) {
    this.debug(ex);
  }
}

function fileDialogComplete(numFilesSelected, numFilesQueued) {
  try {
    if (numFilesSelected > 0 && numFilesQueued > 0 && 
        (numFilesSelected <= this.settings.file_upload_limit || this.settings.file_upload_limit == 0) && 
        (numFilesQueued <= this.settings.file_queue_limit || this.settings.file_queue_limit == 0)) {
      document.getElementById(this.customSettings.cancelButtonId).disabled = false;
      
      expl = document.createElement('div');
      expl.id = 'divExpl';
      expl.style.padding = '10px 0';
      expl.style.fontFamily = 'Trebuchet MS';
      expl.style.fontWeight = 'bold';
      expl.style.width = '100%';
      expl.style.textAlign = 'center';
      progress = document.createElement('div');
      progress.id = this.settings.custom_settings.progressTarget;
      progress.style.width = '100%';
      progress.style.textAlign = 'left';
      container = document.createElement('div');
      container.style.backgroundColor = '#ffffff';
      container.style.width = '100%';
      container.appendChild(expl);
      container.appendChild(progress);
      
      var bg = document.createElement('div');
      bg.style.position = 'absolute';
      bg.style.left = 0;
      bg.style.top = 0;
      bg.style.width = document.body.offsetWidth + 'px';
      bg.style.height = document.body.offsetHeight + 'px';
      bg.style.background = 'url(image/pop/bw.png) repeat scroll left top transparent';
      document.body.appendChild(bg);
      var pane = document.createElement('div');
      bg.appendChild(pane);
      pane.style.position = 'absolute';
      pane.style.left = this.customSettings.position[0] + 'px';
      pane.style.top = this.customSettings.position[1] + 'px';
      pane.style.width = this.customSettings.progressWidth;
      pane.style.padding = '20px 40px';
      pane.style.border = '1px solid #dddddd';
      pane.style.backgroundColor = '#ffffff';
      pane.appendChild(container);
      this.customSettings.bg = bg;
      
      this.customSettings.done = [];
      /* I want auto start the upload and I can do that here */
      this.startUpload();
    }
  } catch (ex) {alert(ex + this.customSettings.browseBtn);
    this.debug(ex);
  }
}

function uploadStart(file) {
  try {
    var total = 0;
    for (var idx in this.customSettings.total) {
      var obj = this.customSettings.total[idx];
      total += parseFloat(obj.size, 10);
    }
    
    var done = 0;
    for (var idx in this.customSettings.done) {
      var obj = this.customSettings.done[idx];
      done += parseFloat(obj.size, 10);
    }
    
    var progress = new FileProgress(file, this.customSettings.progressTarget, Math.ceil((done / total) * 100));
    progress.setStatus("Uploading");
    progress.toggleCancel(true, this);
    
    var elm = document.getElementById('divExpl');
    MyUpload.removeChildElements(elm);
    elm.appendChild(document.createTextNode('Uploading Files ' + (this.customSettings.done.length + 1) + '/' + this.customSettings.total.length + ' (' + MyUpload.formatNumber(parseInt(done / 1000, 10)) + ' of ' + MyUpload.formatNumber(parseInt(total / 1000, 10)) + 'kb' + ')...'));
  } catch (ex) {
  }
  return true;
}

function uploadProgress(file, bytesLoaded, bytesTotal) {
  try {
    var percent = Math.ceil((bytesLoaded / bytesTotal) * 100);
    
    var total = 0;
    for (var idx in this.customSettings.total) {
      var obj = this.customSettings.total[idx];
      total += parseFloat(obj.size, 10);
    }
    
    var done = 0;
    for (var idx in this.customSettings.done) {
      var obj = this.customSettings.done[idx];
      done += parseFloat(obj.size, 10);
    }
    done += parseFloat(bytesLoaded, 10);
    
    var percent2 = Math.ceil((done / total) * 100);
    var progress = new FileProgress(file, this.customSettings.progressTarget);
    progress.setProgress(percent2);
    progress.setStatus("Uploading");
    
    var elm = document.getElementById('divExpl');
    MyUpload.removeChildElements(elm);
    elm.appendChild(document.createTextNode('Uploading Files ' + (this.customSettings.done.length + 1) + '/' + this.customSettings.total.length + ' (' + MyUpload.formatNumber(parseInt(done / 1000, 10)) + ' of ' + MyUpload.formatNumber(parseInt(total / 1000, 10)) + 'kb' + ')...'));
  } catch (ex) {
    this.debug(ex);
  }
}

function uploadSuccess(file, serverData) {
  if (this.customSettings.debug == 1) {
    alert(serverData);
  }
  try {
    var progress = new FileProgress(file, this.customSettings.progressTarget);
    progress.setComplete();
    progress.setStatus("Complete");
    progress.toggleCancel(false);
    progress.fileProgressWrapper.style.display = 'none';
    
    this.customSettings.done[this.customSettings.done.length] = file;
    this.customSettings.msgs[this.customSettings.msgs.length] = serverData;
    
    try {
      var obj = JSON.parse(serverData)
      if (obj['msg']) {
        this.customSettings.finalMsg = obj['msg'];
      }
    } catch (ex) {
    }
    
  } catch (ex) {
    alert(ex);
    this.debug(ex);
  }
}

function uploadError(file, errorCode, message) {
  try {
    var progress = new FileProgress(file, this.customSettings.progressTarget);
    progress.setError();
    progress.toggleCancel(false);

    switch (errorCode) {
    case SWFUpload.UPLOAD_ERROR.HTTP_ERROR:
      progress.setStatus("Upload Error: " + message);
      this.debug("Error Code: HTTP Error, File name: " + file.name + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED:
      progress.setStatus("Upload Failed.");
      this.debug("Error Code: Upload Failed, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.IO_ERROR:
      progress.setStatus("Server (IO) Error");
      this.debug("Error Code: IO Error, File name: " + file.name + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.SECURITY_ERROR:
      progress.setStatus("Security Error");
      this.debug("Error Code: Security Error, File name: " + file.name + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.UPLOAD_LIMIT_EXCEEDED:
      progress.setStatus("Upload limit exceeded.");
      this.debug("Error Code: Upload Limit Exceeded, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.FILE_VALIDATION_FAILED:
      progress.setStatus("Failed Validation.  Upload skipped.");
      this.debug("Error Code: File Validation Failed, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    case SWFUpload.UPLOAD_ERROR.FILE_CANCELLED:
      // If there aren't any files left (they were all cancelled) disable the cancel button
      if (this.getStats().files_queued === 0) {
        document.getElementById(this.customSettings.cancelButtonId).disabled = true;
      }
      progress.setStatus("Cancelled");
      progress.setCancelled();
      break;
    case SWFUpload.UPLOAD_ERROR.UPLOAD_STOPPED:
      progress.setStatus("Stopped");
      break;
    default:
      progress.setStatus("Unhandled Error: " + errorCode);
      this.debug("Error Code: " + errorCode + ", File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
      break;
    }
  } catch (ex) {
        this.debug(ex);
    }
}

function uploadComplete(file) {
  if (this.getStats().files_queued === 0) {
    document.getElementById(this.customSettings.cancelButtonId).disabled = true;
  }
}

function queueComplete(numFilesUploaded) {
  var total = 0, _self = this;
  for (var idx in this.customSettings.total) {
    var obj = this.customSettings.total[idx];
    total += parseFloat(obj.size, 10);
  }
  total = MyUpload.formatNumber(parseInt(total / 1000, 10)) + 'kb';
  
  var done = 0;
  for (var idx in this.customSettings.done) {
    var obj = this.customSettings.done[idx];
    done += parseFloat(obj.size, 10);
  }
  done = MyUpload.formatNumber(parseInt(done / 1000, 10));
  
  var elm = document.getElementById('divExpl');
  MyUpload.removeChildElements(elm);
  if (this.customSettings.finalMsg) {
    elm.appendChild(document.createTextNode(this.customSettings.finalMsg));
    elm.appendChild(document.createElement('br'));
  } else {
    elm.appendChild(document.createTextNode('Uploaded Files: ' + this.customSettings.done.length + ' / ' + this.customSettings.total.length));
    elm.appendChild(document.createElement('br'));
  }
  
  var btn = document.createElement('input');
  btn.type = 'button';
  btn.style.borderTop = '1px solid #eeeeee';
  btn.style.borderLeft = '1px solid #eeeeee';
  btn.style.borderBottom = '2px solid #dddddd';
  btn.style.borderRight = '2px solid #dddddd';
  btn.style.padding = '5px 20px';
  btn.style.marginTop = '20px';
  btn.style.cursor = 'pointer';
  btn.value = 'OK';
  btn.onclick = function () {
    document.body.removeChild(_self.customSettings.bg);
    _self.customSettings.callbackFunc(_self.customSettings.msgs);
    _self.customSettings.msgs = [];
    _self.customSettings.bg = null;
  };
  elm.appendChild(btn);
  
  this.customSettings.done = [];
  this.customSettings.total = [];
};

function FileProgress(file, targetID, initPerc) {
  this.fileProgressID = file.id;

  this.opacity = 100;
  this.height = 0;

  this.fileProgressWrapper = document.getElementById(this.fileProgressID);
  if (!this.fileProgressWrapper) {
    this.fileProgressWrapper = document.createElement("div");
    //    this.fileProgressWrapper.className = "progressWrapper";
    this.fileProgressWrapper.style.width = '100%';
    this.fileProgressWrapper.id = this.fileProgressID;

    this.fileProgressElement = document.createElement("div");
    //    this.fileProgressElement.className = "progressContainer";
    this.fileProgressElement.style.margin = '5px';
    this.fileProgressElement.style.padding = '10px';
    this.fileProgressElement.style.border = 'solid 1px #cccccc';
    this.fileProgressElement.style.backgroundColor = '#ffffff';

    var progressCancel = document.createElement("a");
//        progressCancel.className = "progressCancel";
    progressCancel.style.fontSize = '0';
    progressCancel.style.display = 'block';
    progressCancel.style.height = '16px';
    progressCancel.style.width = '16px';
    progressCancel.style.backgroundImage = 'url(../libs/swfupload/assets/close.png)';
    progressCancel.style.backgroundRepeat = 'no-repeat';
    progressCancel.style.cssFloat  = 'right';
    progressCancel.href = "#";
    progressCancel.style.visibility = "hidden";
    progressCancel.appendChild(document.createTextNode(" "));
    
    var progressText = document.createElement("div");
    //    progressText.className = "progressName";
    progressText.style.fontSize = '12px';
    progressText.style.fontFamily = 'Verdana';
    progressText.style.color = '#555555';
    progressText.style.width = '450px';
    progressText.style.height = '14px';
    progressText.style.textAlign = 'left';
    progressText.style.whiteSpace = 'nowrap';
    progressText.style.overflow = 'hidden';
    progressText.appendChild(document.createTextNode(MyUpload.getShortName(file.name, 45)));

    var progressBar2 = document.createElement("div");
    progressBar2.style.border = '1px solid #dddddd';
    progressBar2.style.marginTop = '5px';
    progressBar2.style.width = '100%';

    var progressBar = document.createElement("div");
    //    progressBar.className = "progressBarInProgress";
    progressBar.style.fontSize = 0;
    progressBar.style.width = ((initPerc) ? initPerc : '0') + '%';
    progressBar.style.height = '20px';
    progressBar.style.backgroundImage = 'url(../libs/myupload/assets/p1.png)';
    progressBar.style.backgroundRepeat = 'repeat-x';
    progressBar2.appendChild(progressBar);

    var progressStatus = document.createElement("div");
    //    progressStatus.className = "progressBarStatus";
    progressStatus.innerHTML = "&nbsp;";
    progressStatus.style.marginTop = '10px';
    progressStatus.style.width = '100%';
    progressStatus.style.fontSize = '11px';
    progressStatus.style.fontFamily = 'Lucida Sans Unicode';
    progressStatus.style.textAlign = 'right';
    progressStatus.style.whiteSpace = 'nowrap';
    
    this.fileProgressElement.appendChild(progressCancel);
    this.fileProgressElement.appendChild(progressText);
    this.fileProgressElement.appendChild(progressStatus);
    this.fileProgressElement.appendChild(progressBar2);
    this.fileProgressWrapper.appendChild(this.fileProgressElement);
    document.getElementById(targetID).appendChild(this.fileProgressWrapper);
  } else {
    this.fileProgressElement = this.fileProgressWrapper.firstChild;
    this.reset();
  }

  this.height = this.fileProgressWrapper.offsetHeight;
  this.setTimer(null);
};

FileProgress.prototype.setTimer = function(timer) {
  this.fileProgressElement["FP_TIMER"] = timer;
};

FileProgress.prototype.getTimer = function(timer) {
  return this.fileProgressElement["FP_TIMER"] || null;
};

FileProgress.prototype.reset = function() {
  //  this.fileProgressElement.className = "progressContainer";

  this.fileProgressElement.childNodes[2].innerHTML = "&nbsp;";
  //  this.fileProgressElement.childNodes[2].className = "progressBarStatus";

  //  this.fileProgressElement.childNodes[3].childNodes[0].className = "progressBarInProgress";
  this.fileProgressElement.childNodes[3].childNodes[0].style.width = "0%";

  this.appear();
};

FileProgress.prototype.setProgress = function(percentage) {
  //  this.fileProgressElement.className = "progressContainer green";
  //  this.fileProgressElement.childNodes[3].childNodes[0].className = "progressBarInProgress";
  this.fileProgressElement.style.border = 'solid 1px #cccccc';
  this.fileProgressElement.style.backgroundColor = '#ffffff';

  this.fileProgressElement.childNodes[3].childNodes[0].style.width = percentage + "%";

  this.appear();
};

FileProgress.prototype.setComplete = function() {
  //  this.fileProgressElement.className = "progressContainer blue";
  //  this.fileProgressElement.childNodes[3].childNodes[0].className = "progressBarComplete";
  this.fileProgressElement.childNodes[3].childNodes[0].style.width = "";

  var oSelf = this;
  this.setTimer(setTimeout(function() {
    oSelf.disappear();
  }, 10000));
};

FileProgress.prototype.setError = function() {
  //  this.fileProgressElement.className = "progressContainer red";
  //  this.fileProgressElement.childNodes[3].childNodes[0].className = "progressBarError";
  this.fileProgressElement.childNodes[3].childNodes[0].style.width = "";

  var oSelf = this;
  this.setTimer(setTimeout(function() {
    oSelf.disappear();
  }, 5000));
};
FileProgress.prototype.setCancelled = function() {
  //  this.fileProgressElement.className = "progressContainer";
  //  this.fileProgressElement.childNodes[3].childNodes[0].className = "progressBarError";
  this.fileProgressElement.childNodes[3].childNodes[0].style.width = "";

  var oSelf = this;
  this.setTimer(setTimeout(function() {
    oSelf.disappear();
  }, 2000));
};

FileProgress.prototype.setStatus = function(status) {
  this.fileProgressElement.childNodes[2].innerHTML = status;
};

//Show/Hide the cancel button
FileProgress.prototype.toggleCancel = function(show, swfUploadInstance) {
  this.fileProgressElement.childNodes[0].style.visibility = show ? "visible" : "hidden";
  if (swfUploadInstance) {
    var fileID = this.fileProgressID;
    this.fileProgressElement.childNodes[0].onclick = function() {
      swfUploadInstance.cancelUpload(fileID);
      return false;
    };
  }
};

FileProgress.prototype.appear = function() {
  if (this.getTimer() !== null) {
    clearTimeout(this.getTimer());
    this.setTimer(null);
  }

  if (this.fileProgressWrapper.filters) {
    try {
      this.fileProgressWrapper.filters.item("DXImageTransform.Microsoft.Alpha").opacity = 100;
    } catch (e) {
      // If it is not set initially, the browser will throw an error.  This will set it if it is not set yet.
      this.fileProgressWrapper.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
    }
  } else {
    this.fileProgressWrapper.style.opacity = 1;
  }

  this.fileProgressWrapper.style.height = "";

  this.height = this.fileProgressWrapper.offsetHeight;
  this.opacity = 100;
  this.fileProgressWrapper.style.display = "";

};

//Fades out and clips away the FileProgress box.
FileProgress.prototype.disappear = function() {

  var reduceOpacityBy = 15;
  var reduceHeightBy = 4;
  var rate = 30; // 15 fps

  if (this.opacity > 0) {
    this.opacity -= reduceOpacityBy;
    if (this.opacity < 0) {
      this.opacity = 0;
    }

    if (this.fileProgressWrapper.filters) {
      try {
        this.fileProgressWrapper.filters.item("DXImageTransform.Microsoft.Alpha").opacity = this.opacity;
      } catch (e) {
        // If it is not set initially, the browser will throw an error.  This will set it if it is not set yet.
        this.fileProgressWrapper.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + this.opacity + ")";
      }
    } else {
      this.fileProgressWrapper.style.opacity = this.opacity / 100;
    }
  }

  if (this.height > 0) {
    this.height -= reduceHeightBy;
    if (this.height < 0) {
      this.height = 0;
    }

    this.fileProgressWrapper.style.height = this.height + "px";
  }

  if (this.height > 0 || this.opacity > 0) {
    var oSelf = this;
    this.setTimer(setTimeout(function() {
      oSelf.disappear();
    }, rate));
  } else {
    this.fileProgressWrapper.style.display = "none";
    this.setTimer(null);
  }
};